<template>
  <div class="slide_show">
    <base-swipe :images="ImgUrl" v-bind="swipeConfig"></base-swipe>
  </div>
</template>

<script lang="ts">
import { defineComponent, computed } from 'vue'
import baseSwipe from '@/base_ui/Yswipe/base_swipe.vue'
import { useStore } from '../../store/index'

export default defineComponent({
  props: {
    pageName: {
      type: String,
      required: true
    }
  },
  components: {
    baseSwipe
  },
  setup(props) {
    const store = useStore()
    //获取轮播图图片路径
    const getContent = () => {
      store.dispatch('banner/getBannerList', props.pageName)
    }
    getContent()
    const ImgUrl = computed(() => store.getters['banner/getDataList'](props.pageName))
    //
    //轮播图的配置
    const swipeConfig: any = {
      autoplay: 3000,
      indicator_color: 'rgb(155, 203, 240)',
      lazy_render: true,
      loop: true
    }
    return {
      ImgUrl,
      swipeConfig
    }
  }
})
</script>

<style scoped lang="less"></style>
